<template>
	<el-container>
		<el-header>
			<div class="left-panel"> </div>
			<div class="right-panel">
				<div class="right-panel-search">
					<el-input v-model="search.keyword" placeholder="标题 / 摘要" clearable></el-input>
					<el-button type="primary" icon="el-icon-search" @click="upsearch"></el-button>
				</div>
			</div>
		</el-header>
		<el-main class="nopadding">
			<scTable ref="table" :apiObj="apiObj" row-key="tableName" stripe remoteSort remoteFilter>
				<el-table-column label="#" type="index" width="50"></el-table-column>
				<el-table-column label="表名称" prop="tableName" width="150" :show-overflow-tooltip="true"></el-table-column>
				<el-table-column label="引擎类型" prop="engine" width="100" :show-overflow-tooltip="true"></el-table-column>
				<el-table-column label="文件大小" prop="dataLength" width="100">
					<template #default="scope">
						{{(scope.row.dataLength/1024).toFixed(2)}}KB
					</template>
				</el-table-column>
				<el-table-column label="记数数" prop="tableRows" width="100">
						<template #default="scope">
							{{(scope.row.tableRows>=0?scope.row.tableRows:0)}}行
						</template>
				</el-table-column>
				<el-table-column label="表注释" prop="tableComment" width="350" :show-overflow-tooltip="true"></el-table-column>
			</scTable>
		</el-main>
	</el-container>
</template>

<script>
export default {
	name: 'DataBase Info List',
	components: {
	},
	data() {
		return {
			apiObj: this.$API.system.sysDataBase.getSystemDBTableInfo,
			search: {
				keyword: null
			}
		}
	},
	mounted() {
	},
	methods: {
		//搜索
		async upsearch() {
			this.$refs.table.upData(this.search)
		},
		//本地更新数据
		handleSaveSuccess() {
			this.$refs.table.refresh()
		}
	}
}
</script>

<style>
</style>
